<!DOCTYPE html>

<html>

	<head>

		<meta name=viewport content='user-scalable=yes'/>

		<link rel=stylesheet href=css/jquery.mobile.css />
		<link rel=stylesheet href=css/additional_styles.css />

		<script src=jquery/jquery.js></script>
		<script src=jquery/jquery.mobile.js></script>
		<script src=jquery/function.js></script>
		<script src=jquery/jquery.knob.js></script>

		<title>Karten</title>
	</head>

	<body>
		<div data-role='page' id='maps1' data-theme=b style='margin-left: 0; margin-right: 0;'>

			<div data-role='popup' id='popupMenu1' data-theme=b>

			</div>

			<div data-role=content data-theme=b >
				<table border="2" cellpadding="2">
					<tr>
						<td width="15%">
						<div>
							<a href="#" onclick="perform_light_change('010', 'ON', 0);">
							<svg id="circle" height="100" width="100"
							xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" >
								<g transform="scale(0.18)">
									<image x="0" y="0" height="600" width="600" xlink:href="images/green.svg" />
								</g>
							</svg> </a>

						</div>
												<div><a href="#" onclick="perform_light_change('010', 'BRIGHT', 0);">	<svg id="circle" height="100" width="100"
							xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" >
								<g transform="scale(0.18)">
									<image x="0" y="0" height="600" width="600" xlink:href="images/plus.svg" />
								</g>
						</svg> </a>
						</div>
						<div>
							<a href="#" onclick="perform_light_change('010', 'OFF', 0);">
							<svg id="circle" height="100" width="100"
							xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" >
								<g transform="scale(0.18)">
									<image x="0" y="0" height="600" width="600" xlink:href="images/red.svg" />
								</g>
							</svg> </a>
						</div>

						
						</td>

						<td align="center">
						<input id="knobkueche" class="knob" data-width="250" data-displayPrevious=true data-fgColor="#91908fff" data-skin="tron" data-thickness=".2" value="8" data-step="1" data-min="0" data-max="16">
						</td>
						<td width="15%"><div><a href="#"  onclick="perform_light_change('013', 'ON', 0);"> 	<svg id="circle" height="100" width="100"
							xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" >
								<g transform="scale(0.18)">
									<image x="0" y="0" height="1000" width="1000" xlink:href="images/green.svg" />
								</g>
						</svg> </a></div>
						
						<div>
													<a href="#" onclick="perform_light_change('010', 'DARK', 0);"> 
							<svg id="circle" height="100" width="100"
							xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" >
								<g transform="scale(0.18)">
									<image x="0" y="0" height="600" width="600" xlink:href="images/minus.svg" />
								</g>
							</svg> 
							</a>
							
						</div>
						
						<div>
							<a href="#"  onclick="perform_light_change('013', 'OFF', 0);"> 	<svg id="circle" height="100" width="100"
							xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" >
								<g transform="scale(0.18)">
									<image x="0" y="0" height="600" width="600" xlink:href="images/red.svg" />
								</g>
							</svg> </a></div></td>
					</tr>
					<tr>
						<td></td>
						<td>
</td>
						<td></td>
					</tr>
				</table>

			</div>

			<div data-role=header data-position=fixed id=footer_actors data-theme=a>
				<div data-role=navbar>
					<ul>
						<li></li>
						<li>
							<a href='lightmanager.php'></a>
						</li>
						<li></li>
					</ul>
				</div>
			</div>

		</div>
	</body>
	<script>
		knobkueche('010');

	</script>
</html>

